@import "../../styles/color.less";
@import "../../styles/func.less";
@import "../../styles/fontsize";
@import "../../styles/class";

.rowContainer {
  display  : flex;
  flex-wrap: wrap;
  transform: translateX(-50%);
  left     : 54%;
  position : relative;


  .dayItem {
    width             : 100rpx;
    height            : 100rpx;
    display           : flex;
    justify-content   : center;
    align-items       : center;
    // border-right   : 1px solid @divideColor;
    // border-bottom  : 1px solid @divideColor;

    .innerActiveContaienr {
      width          : 50rpx;
      height         : 50rpx;
      color          : @blackColor;
      border-radius  : 100%;
      display        : flex;
      justify-content: center;
      align-items    : center;
      flex-direction : column;
      font-size      : @fontsize;

      &.disabled {
        color     : @descColor;
        background: #fff;
      }

      .state-bolls {
        display: flex;

        .boll {
          border-radius: 100%;
          background   : #ddd;
          .size(10rpx);
          margin-right: 5rpx;
          position    : relative;
          top         : 14rpx;

          &.redboll {
            background: @red;
          }

          &.blueboll {
            background: @blue;
          }

          &:last-child {
            margin-right: none;
          }
        }
      }
    }

    &.active {
      color     : #fff;
      background: @red;

      .innerActiveContaienr {
        color: #fff;
      }
    }


    &.dayItem0,
    &.dayItem7,
    &.dayItem14,
    &.dayItem21,
    &.dayItem28,
    &.dayItem35 {
      // border-left: 1px solid @divideColor;
    }

    &.dayItem0,
    &.dayItem1,
    &.dayItem2,
    &.dayItem3,
    &.dayItem4,
    &.dayItem5,
    &.dayItem6 {
      // border-top: 1px solid @divideColor;
    }
  }
}

.weeksRow {
  display    : flex;
  align-items: center;
  left       : 54%;
  position   : relative;
  transform  : translateX(-50%);
  margin-top : 20rpx;

  .weekItem {
    height         : 52rpx;
    font-size      : @superSmall;
    width          : 100rpx;
    height         : 50rpx;
    display        : flex;
    justify-content: center;
    align-items    : center;
    font-weight    : @ligher;

    &.active {
      color     : #fff;
      background: @red;
    }
  }
}

.datePickRow {
  display        : flex;
  align-items    : center;
  font-size      : @fontsize;
  justify-content: center;
  margin-top     : 40rpx;
  margin-bottom  : 40rpx;


  .text {
    padding-left : 20rpx;
    padding-right: 20rpx;

  }

  &.active {}
}

.bottomRow {
  margin-top    : 40rpx;
  padding-bottom: 20rpx;
  .center-c();
  justify-content: space-between;
  padding-right  : 20rpx;

  .pickRow {
    .center-c();
    background    : @bgColor;
    font-size     : @small;
    width         : 230rpx;
    padding-left  : 30rpx;
    padding-top   : 10rpx;
    padding-bottom: 10rpx;

    .icon {
      width: 40rpx;
    }
  }

  .qindao-button {
    .center-r();
    .center-c();
    background    : linear-gradient(172deg, rgba(249, 208, 77, 1) 0%, rgba(249, 194, 84, 1) 50%, rgba(232, 160, 36, 1) 100%);
    box-shadow    : 0px 0px 5px rgba(255, 189, 6, 1);
    width         : 150rpx;
    font-size     : @fontsize;
    border-radius : 50rpx;
    color         : #fff;
    padding-top   : 5rpx;
    padding-bottom: 5rpx;
  }
}
